<!-- eslint-disable vue/multi-word-component-names -->
<template>
    <el-dialog v-model="store.show" width="900">
        <h2> {{ store.title }}</h2>

        <div class="dialog-header">
            <p><span>学生学号:</span><el-input v-model="store.rowData.stuNo" style="width:30%;" placeholder="请输入学生学号"></el-input></p>
            <p><span>学生姓名:</span><el-input v-model="store.rowData.stuName" style="width:30%;" placeholder="请输入学生姓名"></el-input></p>
            <p><span>学生班级:</span><el-input v-model="store.rowData.className" style="width:30%;" placeholder="请输入学生班级"></el-input></p>
            <p><span>毕业薪资:</span><el-input v-model="store.rowData.salary" style="width:30%;" placeholder="请输入毕业薪资"></el-input></p>
            <p><span>上班城市:</span> <el-cascader v-model="store.rowData.workCity" :options="citys" /></p>
            <p><span>专业:</span> 
                <el-select v-model="store.rowData.expertiseId" placeholder="Select" size="large" style="width: 3rem">
                    <el-option value="游戏设计">游戏运营</el-option>
                    <el-option value="游戏设计">游戏设计</el-option>
                    <el-option value="元宇宙">元宇宙</el-option>
                </el-select>
            </p>
            <p><span>市场部:</span><el-input v-model="store.rowData.origin" style="width:30%;" placeholder="请输入市场部"></el-input></p>
            <p><span>学 院:</span> 
                <el-select v-model="store.rowData.collegeId" placeholder="Select" size="large" style="width: 3rem">
                    <el-option value="游戏学院">游戏学院</el-option>
                    <el-option value="网站学院">网站学院</el-option>
                </el-select>
            </p>
            <p><span>毕业年份:</span> <el-input v-model="store.rowData.gradYear" style="width:30%;"></el-input></p>
            <p><span>学生状态:</span>
                <el-radio-group v-model="store.rowData.status" class="ml-4" @change="ChangeStaus">
                    <el-radio value="未毕业">未毕业</el-radio>
                    <el-radio value="返校重听">返校重听</el-radio>
                    <el-radio value="已就业">已就业</el-radio>
                    <el-radio value="返回未就业">返回未就业</el-radio>
                    <el-radio value="以往未就业">以往未就业</el-radio>
                </el-radio-group>
            </p>
        </div>
        <div style="width: 100%; height: 50px;">
            <el-button type="primary" style="float: right;" @click="SubmitDialog">确定</el-button>
            <el-button  style="float: right; margin-right: 30px" @click="CancelDialog">取消</el-button>
        </div>

    </el-dialog>

</template>

<script lang="ts" setup>
import { citys } from '../../EmploymentSituation/city';
import { useStore } from '@/stores/login'
const store = useStore()

const ChangeStaus = (value: string) => {
    store.rowData.status = value
}
// 确定
const SubmitDialog = () =>{
    if(store.title == '编辑'){
        console.log(store.rowData);
        store._editlistActions()
        store.show = false
        store.getlist()
    } else if(store.title == '查看'){
        store.ResetRowData()
             store.show = false
    } else if(store.title == '添加'){
        store._addlistActions()
        //   store.show = false
    }
    
}
// 取消
const CancelDialog = ()=>{
    store.show = false
    store.ResetRowData()
}
</script>

<style>
.dialog-header span {
    display: inline-block;
    width: 7%;
    text-align: justify;
    text-align-last: justify;
    margin-right: 2%;
}

.dialog-header p {
    margin-top: .25rem;
}
</style>